/**
 * Created by qiangqiang on 2016/12/14.
 */
import React, {Component} from 'react';
import {
    Text,
    Image,
    View,
    StyleSheet,
    TouchableOpacity,
    TextInput,
    Platform,
    BackAndroid
} from 'react-native';
import Header from '../component/HeaderWithSubmit';
import Starrating from 'react-native-star-rating';

export default class Evaluate extends Component {
    constructor(props) {
        super(props);
        this.state = {
            starCount: 3.5
        };
    }

    onStarRatingPress(rating) {
        this.setState({
            starCount: rating
        });
    }

    _backtoDiscoverTab = () => {
        const {navigator}=this.props;
        if (navigator) {
            navigator.pop();
        }
    }

    /* react-native 生命周期里的自带方法，发生在组件出现前
     * Mount为安装，Unmout为卸载
     */

    /* Android返回键执行的操作 被之前BackAndoid组件调用*/
    onBackAndroid = () => {
        const {navigator} = this.props;
        const routers = navigator.getCurrentRoutes();
        if (routers.length > 1) {
            navigator.pop();
            return true;
        }
        return false;
    };

    render() {
        return (
            <View style={styles.container}>
                <Header name="评价"
                        submit_name="发布"
                        function={this._backtoDiscoverTab.bind(this)}/>
                <View style={{flex: 10}}>
                    <View style={styles.body_view1}>
                        <View style={styles.body_view1_photo}>
                            <Text style={styles.body_view1_photo_font}>
                                照片
                            </Text>
                        </View>

                        <View style={styles.body_view1_right}>
                            <Text style={styles.body_view1_right_Text1}>
                                小朱
                            </Text>

                            <Text style={{flex: 1}}>
                                开发部 职员
                            </Text>

                            <Text style={{flex: 1}}>
                                今日目标：今天要完成后端数据解析，完成数据库操作。
                            </Text>

                        </View>
                    </View>

                    <View style={styles.body_view2}>
                        <View style={{flex: 1}}>
                            <Text>
                                自我评价:很充实
                            </Text>
                        </View>

                        <View style={styles.body_view2_text2}>
                            <Text>
                                星级评价
                            </Text>

                            <Starrating
                                disabled={false}
                                starSize={15}
                                maxStars={5}
                                starColor={"#FFFF00"}
                                rating={this.state.starCount}
                                selectedStar={(rating) => this.onStarRatingPress(rating)}
                            />
                        </View>

                        <View style={{flex: 1}}>
                            <Text>
                                评价
                            </Text>
                        </View>
                    </View>

                    <TextInput style={styles.body_textInput}
                               multiline={true}>
                    </TextInput>


                    <View style={{flex: 1}}>

                    </View>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: "#ffffff"
    },
    body_view1: {
        flexDirection: "row",
        flex: 1.5,
        marginTop: 15,
        marginLeft: 15
    },
    body_view1_photo: {
        flex: 1,
        justifyContent: "center",
        alignItems: "center",
        borderColor: "#CACACA",
        borderWidth: 1
    },
    body_view1_photo_font: {
        fontSize: 20
    },
    body_view1_right: {
        flex: 1.5,
        marginLeft: 5,
        marginRight: 15
    },
    body_view1_right_Text1: {
        fontSize: 25,
        fontWeight: "bold",
        flex: 2
    },
    body_view2: {
        flex: 1,
        marginLeft: 15,
        marginTop: 10
    },
    body_view2_text2: {
        flexDirection: "row",
        flex: 1
    },
    body_textInput: {
        borderColor: "#CACACA",
        flex: 2,
        borderWidth: 1,
        textAlignVertical: "top",
        marginLeft: 15,
        marginRight: 15
    }
});